<template>
	<view class="msglist">
		<view>
			<view v-for="(item,index) in list" :key="index" @click="go_details(item.id)">
				<view class="list">
					<view class="img"><image src="../../../static/img/msg1.png"></image></view>
					<view class="right">
						<view class="flex">
							<view class="title">{{item.title}}</view>
							<!-- <text>{{item.isRead.desp}}</text> -->
							<text class="date">2019-06-20</text>
						</view>
						<view class="describe">
							{{item.msg}}
						</view>
					</view>
				
					
				</view>
			</view>
			<view v-show="list.length==0" class="notavailable">
				<image src="../../../static/img/notavailable.png" mode="widthFix"></image>
				<view class="nottext">暂时没有数据</view>
			</view>
		</view>
		<view class="pagination" v-if="list.length>0">
			<view class="left" :class="{ forbid: paging.page == 1 }" @click="prev">
				<uni-icons type="arrowleft" size="20" color="#fff" class="icons" />
				上一页
			</view>
			<view class="center">{{ paging.page }}/{{ paging.total }}</view>
			<view class="right" :class="{ forbid: paging.page == paging.total }" @click="next">
				下一页
				<uni-icons type="arrowright" size="20" color="#fff" class="icons" />
			</view>
		</view>
	</view>
</template>
<script>
	import {
		uniIcons
	} from '@dcloudio/uni-ui';
	import news from '../../../servers/news/msg.js'
	export default {
		data() {
			return {
				type: 0,
				list: [],
				paging: {
					page: 1,
					total: 10
				}
			}
		},
		mounted() {
			var login = uni.getStorageSync('login');
			if (login) {
				this.get_data()
			}
		},
		methods: {
			get_data() {
				var obj = {
					currentPage: this.paging.page,
					pageSize: 10
				}
				news.newslist(obj).then(res => {
					this.paging.total = Math.ceil(res.data.total / res.data.size);
					// this.list = res.data.records.map(v => {
					// 	v.image = this.imgCDNUrl + v.img
					// 	return v
					// })
					this.list = res.data.records
				}).catch(err => {
					console.log(new Error('请检查网络后重试'))
				})
			},
			next() {
				if (this.paging.page < this.paging.total) {
					this.paging.page += 1;
					this.get_data();
				}
			},
			prev() {
				if (this.paging.page > 1) {
					this.paging.page -= 1;
					this.get_data();
				}
			},
			go_details(id) {
				uni.setStorage({
					key: 'msg_id',
					data: id,
					success: function() {
						uni.navigateTo({
							url: '/pages/shop/news/msg'
						});
					}
				});
			}
		}
	}
</script>
<style lang="less" scoped>
	.msglist {
		.list {
			padding: 20rpx;
			display: flex;
			align-items: center;
			.img{
				width: 80rpx;
				height: 80rpx;
				margin-right: 20rpx;
				image{
					width: 80rpx;
					height: 80rpx;
				}
			}
			
			.right{
				flex: 1;
				.title{
					width: 450rpx;
					overflow: hidden;
					text-overflow:ellipsis;
					white-space: nowrap;
				}
				.flex{
					display: flex;
					justify-content: space-between;
					.date{
						color: #999;
						font-size: 28rpx;
					}
				}
				.describe{
					color: #999;
					font-size: 28rpx;
					overflow: hidden;
					text-overflow:ellipsis;
					white-space: nowrap;
				}
				
			}
			
		}
	}
</style>
